<template>
  <div class="discount">
    <div class="discount-header">
      <div class="discount-header-back">
        <van-icon name="arrow-left" size=".2rem" color="#fff" @click="goHome" />
      </div>
      <div class="discount-header-title">5.5吾折天</div>
    </div>
    <div class="discount-wrap">
      <div class="discount-banner">
        <img
          src="https://img.alicdn.com/imgextra/i2/2053469401/O1CN01wU8kUJ2JJi1HrBIIF_!!2053469401.png"
          alt=""
        />
      </div>
      <HalfList />
    </div>
  </div>
</template>
<script lang="ts">
import { defineComponent } from "vue";
import HalfList from "@/components/HalfList/index.vue";
import { useRouter } from "vue-router";
export default defineComponent({
  setup() {
    const router = useRouter();
    const goHome = () => {
      router.push("/home");
    };
    return {
      goHome,
    };
  },
  components: {
    HalfList,
  },
});
</script>

<style lang="stylus" scoped>
.discount
    overflow hidden
.discount-header
    width 100%
    position fixed
    z-index 99
    background url(https://img.alicdn.com/imgextra/i4/2053469401/O1CN011TM4Zn2JJi1K2DdqC_!!2053469401.png) 0% 0% / 100% no-repeat
    line-height .45rem
    color #fff
    font-weight 400
    text-align center
    height .45rem
    display flex
    align-items center
    .discount-header-back
        display flex
        margin-left .1rem
    .discount-header-title
        font-size .18rem
        line-height .45rem
        margin-left 1.1rem
.discount-wrap
    margin-top .45rem
    background #eee url("https://img.alicdn.com/imgextra/i4/2053469401/O1CN011TM4Zn2JJi1K2DdqC_!!2053469401.png") 0% 0% / 100% no-repeat
    .discount-banner
        height 1.68rem
        img
            width 100%
</style>
